<template>
  <div>
    <navigation></navigation>
    <div class="main">
      <room-list :list="rooms" class="room-list shadow"></room-list>
    </div>
    <!--    操了 这个代码写的烂的1p 页面layout混乱不堪 组件乱封装 简直是屎坑-->
    <!--    也自己写个得了-->

    <div class="back-wrapper shadow rounded"></div>
  </div>
</template>

<script>
import RoomButtons from "./components/Buttons";
import RoomList from "./components/List";
import axios from "axios";
import Navigation from "../../common/navigation/Navigation";

export default {
  components: {
    Navigation,
    RoomList,
    RoomButtons
  },
  name: "ShowRoom",
  data() {
    return {
      rooms: []
    };
  },
  methods: {
    getInfo() {
      axios.defaults.headers.common["Authorization"] = this.$store.state.token;
      axios
        .get("http://119.23.110.183:8080/getMeetingRoomList")
        .then(this.getInfoSucc);
    },
    getInfoSucc(res) {
      res = res.data;
      if (res.code === 0) {
        const data = res.data;
        this.rooms = data.meetingRooms;
      }
    }
  },
  activated() {
    this.getInfo();
  }
};
</script>

<style lang="stylus" scoped>
.image {
  width: 300px;
  display: block;
}
.main
  //height 0
  width 100%
  padding 100px
  margin-left 90px
  margin-top 10px
  //margin-top 110px
  //margin-left 180px

.back-wrapper
  width 83.2%
  height 83.5%
  background-color white
  z-index -1
  position absolute
  top 85px
  left 190px
</style>
